<template>
  <div @click="$emit('like',obj.dogName)" >
     <img  src="http://nwzimg.wezhan.cn/contents/sitefiles2029/10146688/images/21129958.jpg" alt="">
     <p @click="changeColor" :style="{background:bgColor}">{{obj.dogName}}</p>
   </div>
</template>
 
<script>
export default {
    name: "LianxiOne",
  components: {},
  props: {
    obj:{
        type: Object,
        required: true
    }
  },
  data() {
    return {
        bgColor:'',
        color:""
    };
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    changeColor() {
        // console.log(`rgb(${this.getRandom()},${this.getRandom()},${this.getRandom()})`)
        this.bgColor = `rgb(${this.getRandom()},${this.getRandom()},${this.getRandom()})`
    },
    getRandom() {
       return Math.floor(Math.random()*256)
    }
  }
};
</script>

<style scoped>
div {
    width: 230px;
    text-align: center;
    border: 1px solid #087;
    float: left;
} 

img {
    width: 100%;
}
</style>